Add short URL sharing via paste service to fix URL truncation by GunitBindal · Pull Request #188 · backnotprop/plannotator

GunitBindal · 2026-02-26T14:54:58Z

Summary

Fixes #187 — Share URLs for large plans are 10-40KB+ and get truncated by Slack, WhatsApp, email clients, etc., making the team sharing feature unusable for real-world plans. Also addresses the root cause behind #142 (silent fallback to demo plan on truncated URLs).

This adds an optional paste-service backend that stores compressed plan payloads and returns short ~50-char URLs like share.plannotator.ai/p/aBcDeFgH.

What changed

New: apps/paste-worker/ — Cloudflare Worker paste service

POST /api/paste stores compressed plan data in KV, returns short ID
GET /api/paste/:id retrieves stored data
90-day TTL, 512KB limit, CORS configured
Single file (~130 lines), zero dependencies, essentially free to run

Modified: packages/ui/utils/sharing.ts

Added createShortShareUrl() — POSTs compressed data to paste service (5s timeout)
Added loadFromPasteId() — fetches plan by paste ID (10s timeout)
Exported toShareableImages (was module-private, now needed by createShortShareUrl)
All existing functions unchanged

Modified: packages/ui/hooks/useSharing.ts

Added shortShareUrl, isGeneratingShortUrl, shortUrlError to hook state
loadFromHash() now checks for /p/<id> path pattern first, then falls back to hash
Auto-generates short URL with 1s debounce when annotations change
All existing behavior preserved

Modified: packages/ui/components/ExportModal.tsx

Share tab shows short URL as primary copy target when available
Full hash URL always visible as backup
Loading spinner while short URL generates
Amber hint when paste service is unavailable
Copy button tracks which URL was copied (short/full/annotations independently)

Modified: packages/editor/App.tsx

Passes new short URL props from useSharing to ExportModal

Design decisions

Fully backward compatible — hash-based URLs work exactly as before
Graceful degradation — if paste service is down, silently falls back to hash URLs
Self-host friendly — PLANNOTATOR_PASTE_URL env var overrides the paste API URL
No new dependencies — uses native fetch + existing compression utils
Portal support is automatic — useSharing hook detects /p/<id> paths, so the portal inherits short URL loading without any portal-specific changes

Deployment note

The paste worker (apps/paste-worker/) needs to be deployed separately to paste.plannotator.ai with a Cloudflare KV namespace. Until deployed, the feature degrades gracefully — users see only the existing hash-based URL.

Test plan

Verify existing hash-based share URLs still work unchanged
Verify ExportModal shows short URL when paste service is available
Verify ExportModal falls back to hash URL only when paste service is unavailable
Verify portal loads plans from /p/<id> paths
Verify portal still loads plans from /#<hash> paths (backward compat)
Verify short URLs work in Slack, WhatsApp, email (no truncation)
Verify Copy button independently tracks short vs full URL state
Deploy paste worker and test end-to-end

…k/messaging apps Share URLs for large plans can be 10-40KB+ because the entire plan + annotations are compressed into the URL hash. Services like Slack, WhatsApp, and Twitter truncate these URLs, making shared plans unviewable (related: backnotprop#142). This adds an optional paste-service backend that stores compressed payloads and returns short ~60-char URLs (e.g. share.plannotator.ai/p/aBcDeFgH). Changes: - Add Cloudflare Worker paste service (apps/paste-worker/) with KV storage and 90-day TTL for stored plans - Add createShortShareUrl() and loadFromPasteId() to sharing utils - Update useSharing hook to auto-generate short URLs with 1s debounce - Update ExportModal to show short URL as primary copy target with full hash URL as backup - Portal automatically supports /p/<id> paths via useSharing hook - Fully backward compatible: hash-based URLs continue to work unchanged - Graceful degradation: falls back to hash URLs if paste service is unavailable

- Worker: return only { id } so client constructs URL with its own shareBaseUrl (fixes self-hosted deployments) - importFromShareUrl: handle /p/<id> short URLs in addition to hash URLs (fixes teammate import via short links) - Anchor /p/<id> regex with ^ to prevent false matches on nested paths - Pass shareBaseUrl to loadFromPasteId (was always defaulting) - replaceState preserves base path instead of hardcoding / - Clear stale shortShareUrl immediately on debounce to prevent showing outdated link during the 1s delay - Add shareBaseUrl to dependency arrays for loadFromHash and importFromShareUrl callbacks - Remove unused url field fallback from paste API response parsing

backnotprop · 2026-02-27T04:29:38Z

Thank you for this @GunitBindal

Am I right in assuming that this is primarily intended for self-hosters? Also, do you self-host?

Right now, the static site can be somewhat trusted because it's still open source and I'm not logging anything. There's no backend. This sorta changes the nature if I support this, but I understand why it's a great value add for the self-hoster especially.

It doesn't mean I'm not opposed to adding it for the plannotator.ai domain. I'll make sure to be a bit more transparent about when things get stored.

GunitBindal · 2026-02-27T12:16:24Z

Hey Michael — thanks for the quick response! Also messaged you on X about this.

To answer your question: no, I don't self-host — I use plannotator.ai directly with Claude Code. The long URL problem hits me (and I imagine most users) on the hosted version itself. Any plan with real annotations produces 10-40KB+ URLs that Slack, WhatsApp, Teams, and email all silently truncate. It makes sharing with teammates essentially broken.

So while the PR is designed to also work for self-hosters, the primary motivation is fixing sharing on plannotator.ai itself.

I totally understand the trust concern — the beauty of the current design is zero backend. A few ways to keep that trust while enabling short URLs:

Client-side encryption — encrypt the payload with a key embedded in the URL fragment (like share.plannotator.ai/p/aBcDeFgH#decryptionKey). The server stores opaque blobs, can't read anything. Similar to how Excalidraw+ and PrivateBin work.
Auto-expiry transparency — 90-day TTL is already in the PR. Could add a visible "expires on" badge in the share UI so users know exactly when data is purged.
Keep both options — the PR already falls back to hash URLs if the paste service is down. Could make it opt-in: a toggle in the share modal ("Use short URL" vs "Use direct link"). Users who want zero-backend can stick with hash URLs.
Open-source the worker — the Cloudflare Worker is already in the PR under apps/paste-worker/. Fully auditable, same as the rest of the codebase.

I really love Plannotator — it's become essential to my Claude Code workflow, and this is the one thing blocking me from sharing reviews with my team daily. I'm happy to implement any of the above approaches if you point me in a direction. Also have a few more feature ideas — if you're open to receiving PRs, I'd love to contribute more.

backnotprop · 2026-02-27T14:10:11Z

These are all great options - I think for large plans we can just be transparent that there will be a temporary storage of the plan to enable sharing on Plannotator.ai. I'll add this as I review the PR today.

Your feature idea for remote sessions is good - happy to take contributions it's also something I've been wanting as I do remote sessions now too.
Happy to take more contributions!!

backnotprop · 2026-02-27T16:40:36Z

Code review

Found 1 issue:

loadFromPasteId is called with shareBaseUrl (the share portal URL, e.g. https://share.plannotator.ai) as its second argument, but the parameter expects pasteApiUrl (the paste backend URL, e.g. https://paste.plannotator.ai). These are different domains. The fetch goes to share.plannotator.ai/api/paste/<id> instead of paste.plannotator.ai/api/paste/<id>, causing all short URL loading to fail silently — both when opening a /p/<id> link and when importing a teammate's short URL. The function signature in sharing.ts documents this clearly: loadFromPasteId(pasteId: string, pasteApiUrl: string = DEFAULT_PASTE_API) where DEFAULT_PASTE_API = 'https://paste.plannotator.ai'. The call sites should either omit the second argument (letting the default apply) or pass a separate pasteApiUrl option.

plannotator/packages/ui/hooks/useSharing.ts

Lines 116 to 118 in 0e32665

    
           const pasteId = pathMatch[1]; 
        
           const payload = await loadFromPasteId(pasteId, shareBaseUrl); 
        
           if (payload) {

plannotator/packages/ui/hooks/useSharing.ts

Lines 274 to 276 in 0e32665

    
           const pasteId = shortMatch[1]; 
        
           const loaded = await loadFromPasteId(pasteId, shareBaseUrl); 
        
           if (!loaded) {

plannotator/packages/ui/utils/sharing.ts

Lines 299 to 306 in 0e32665

    
            */ 
        
           export async function loadFromPasteId( 
        
             pasteId: string, 
        
             pasteApiUrl: string = DEFAULT_PASTE_API 
        
           ): Promise<SharePayload | null> { 
        
             try { 
        
               const response = await fetch(`${pasteApiUrl}/api/paste/${pasteId}`, { 
        
                 signal: AbortSignal.timeout(10_000),

🤖 Generated with Claude Code

_{- If this code review was useful, please react with 👍. Otherwise, react with 👎.}

@backnotprop

Bug fix (addresses @backnotprop's code review): - useSharing hook now accepts separate `pasteApiUrl` parameter instead of incorrectly passing `shareBaseUrl` to `loadFromPasteId`. These are different domains (share portal vs paste backend). When omitted, the default `https://paste.plannotator.ai` is used correctly. - Fixed in all three call sites: loadFromHash, importFromShareUrl, and generateShortUrl (via createShortShareUrl options). Remote session share URLs (implements backnotprop#192): - When running on a remote instance (SSH, devcontainer), Plannotator now generates a share.plannotator.ai URL and prints it to stderr so the user can open the plan review in their local browser. - Works for all three modes: plan review, code review, and annotate. - Uses the same deflate-raw + base64url encoding as the client. - Fails silently if URL generation fails — port forwarding still works. - New server utility: packages/server/share-url.ts

GunitBindal · 2026-02-28T05:42:03Z

Great catch @backnotprop — you're absolutely right. shareBaseUrl (the share portal, e.g. share.plannotator.ai) and pasteApiUrl (the paste backend, e.g. paste.plannotator.ai) are different domains, and I was passing the wrong one to loadFromPasteId.

Fixed in the latest commit (e917a84):

The bug fix:

useSharing now accepts a separate pasteApiUrl parameter (optional, defaults to https://paste.plannotator.ai when omitted)
All three call sites (loadFromHash, importFromShareUrl, generateShortUrl) now correctly pass pasteApiUrl to paste service functions and shareBaseUrl to URL construction functions
Existing callers (like App.tsx) don't need to change — omitting pasteApiUrl uses the correct default

Also in this commit — remote session support (#192):
Since you mentioned you also do remote sessions, I went ahead and implemented the feature from issue #192 in the same branch. When isRemoteSession() is true, the hook now generates a share.plannotator.ai hash URL server-side and prints it to stderr so the user can open it in their local browser. Works for all three modes (plan review, code review, annotate). Zero setup required.

On the privacy/transparency topic:
I researched zero-backend alternatives extensively. The best option that preserves your "no backend" trust model:

PrivateBin approach — instead of a custom Cloudflare Worker, use the PrivateBin protocol (which multiple free public instances support). The client encrypts with AES-256-GCM before uploading, and the key lives only in the URL fragment. The server provably cannot read the content — same zero-knowledge model as Excalidraw+. The share URL would be ~120 chars. Public instances have CORS enabled, no auth needed.

That said, your approach of "just be transparent about temporary storage" is probably simpler and more practical for users. The Cloudflare Worker in this PR stores opaque compressed data with a 90-day TTL and the code is fully auditable in apps/paste-worker/. Either approach works — happy to implement whichever direction you prefer.

- share-url.ts: Replace btoa(String.fromCharCode(...compressed)) with a loop to avoid RangeError on plans >65K compressed bytes - share-url.ts: Add cross-reference comment noting the server-side SharePayload is an intentional subset of the canonical UI type - paste-worker: Only return CORS headers for allowed origins; disallowed origins get no CORS headers instead of misleading partial headers - useSharing.ts: Remove unused shareBaseUrl from loadFromHash dependency array (loadFromHash only uses pasteApiUrl, not shareBaseUrl)

backnotprop · 2026-02-28T05:55:52Z

Oh sorry for that comment hopefully wasn't distracting.

I'm also evaluating my infra options bc I tend to deploy to AWS. Will consider Cloudflare here though.

And behind the scenes I have a OpenClaw prototype for Plannotator I need to make some decisions for because it also requires a backend.

Thank you for the continued effort! Excited to get this in. I plan to finalize and merge before weekend ends

GunitBindal · 2026-02-28T05:57:22Z

Oh sorry for that comment hopefully wasn't distracting.

I'm also evaluating my infra options bc I tend to deploy to AWS. Will consider Cloudflare here though.

And behind the scenes I have a OpenClaw prototype for Plannotator I need to make some decisions for because it also requires a backend.

Thank you for the continued effort! Excited to get this in. I plan to finalize and merge before weekend ends

Thanks for a quick reply; I came up with a new PrivateBin approach as well. That might be also a good approach. What do you think?

GunitBindal mentioned this pull request Feb 26, 2026

Share URLs are too large for Slack/messaging apps (10-40KB+ URLs get truncated) #187

Open

GunitBindal mentioned this pull request Feb 27, 2026

Remote Claude Code sessions: no way to open plan review UI without a local browser #192

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add short URL sharing via paste service to fix URL truncation#188

Add short URL sharing via paste service to fix URL truncation#188
GunitBindal wants to merge 4 commits intobacknotprop:mainfrom
GunitBindal:fix/short-share-urls

GunitBindal commented Feb 26, 2026 •

edited

Loading

Uh oh!

backnotprop commented Feb 27, 2026 •

edited

Loading

Uh oh!

GunitBindal commented Feb 27, 2026

Uh oh!

backnotprop commented Feb 27, 2026 •

edited

Loading

Uh oh!

backnotprop commented Feb 27, 2026

Uh oh!

GunitBindal commented Feb 28, 2026

Uh oh!

backnotprop commented Feb 28, 2026

Uh oh!

GunitBindal commented Feb 28, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

GunitBindal commented Feb 26, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

What changed

Design decisions

Deployment note

Test plan

Uh oh!

backnotprop commented Feb 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

GunitBindal commented Feb 27, 2026

Uh oh!

backnotprop commented Feb 27, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

backnotprop commented Feb 27, 2026

Code review

Uh oh!

GunitBindal commented Feb 28, 2026

Uh oh!

backnotprop commented Feb 28, 2026

Uh oh!

GunitBindal commented Feb 28, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

GunitBindal commented Feb 26, 2026 •

edited

Loading

backnotprop commented Feb 27, 2026 •

edited

Loading

backnotprop commented Feb 27, 2026 •

edited

Loading